<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<script type="text/javascript">
	var temp = "";
	function buyOnOff(no){
		temp = no;
	}
	$(function(){
		$(":input[id=buyBtn]").click(function(){
			var $onoffView = $(this).parent().children("#onoffView");
			
			var onoffVal = ($onoffView.text()=="ON") ? 1 : 0;
			
			$.ajax({
				type:"post",
				url:"buyBookVisible.do",
				data:"bVisible="+onoffVal + "&no="+temp,
				dataType:"json",
				success:function(data){
					$onoffView.html(data.flag);
				}	// callback
			});	// ajax 
		});
	});
</script>
<script type="text/javascript">
	function updateSale(no){
		location.href="auth_moveBuyUpdate.do?no="+no;
	}
	function deleteSale(no){
		if(confirm("삭제하시겠습니까?")){
			location.href="auth_deleteBuyBook.do?no="+no;
		}
	}
</script>
<fieldset>
<legend><h2>나의희망도서
<a href="auth_moveBuyRegister.do">
<img src="${initParam.root }img/plus.png" title="희망도서 추가"></a></h2></legend><br>
	<c:choose>
			<c:when test="${requestScope.noData == false}">
				<center>조건에 맞는 도서가 없습니다.</center>
			</c:when>
			<c:otherwise>
	<table cellpadding="5">
		<tr><td colspan="3"><hr></td></tr>
			<c:forEach var="bbvo" items="${requestScope.mybuybooklvo.list}" begin="0" end="4">
			<tr>
				<td align="center" width="200px"><img src="${bbvo.image }"></td>
				<td width="600px"><b><font color='#ED4C00'>${bbvo.mvo.uvo.univ }</font><br>${bbvo.title }</b><br>
					${bbvo.writer }&nbsp;&nbsp;|&nbsp; ${bbvo.publisher
					}&nbsp;&nbsp;|&nbsp; ${bbvo.version }&nbsp;&nbsp;|&nbsp;
					${bbvo.status }<br> ${bbvo.price }원
				</td>
				<td align="center" width="200px">
					<c:choose>
						<c:when test="${bbvo.bVisible==1}">
							<div id="onoffView" align="center">ON</div>
						</c:when>
						<c:otherwise>
							<div id="onoffView" align="center">OFF</div>
						</c:otherwise>
					</c:choose>
					<input type="button" id="buyBtn" value="희망 ON/OFF" onclick="buyOnOff('${bbvo.no }')" style="width:99px; height:30px;"><br>
					<input type="button" id="updateSale" value="수정" onclick="updateSale('${bbvo.no }')" style="color:white; background-color:#1F50B5; width:47px; height:30px;">
					<input type="button" id="deleteSale" value="삭제" onclick="deleteSale('${bbvo.no }')" style="color:white; background-color: #C90000; width:47px; height:30px;">
				</td>
			</tr>
				<tr><td colspan="3"><hr></td></tr>
			</c:forEach>
		</table>
		<center>
		<br>
		<table>
	<tr>
		<td>
		<!-- 페이징 처리 -->
		<%-- 이전 페이지 그룹이 있으면 이미지 보여준다.
			   이미지 링크는 현 페이지 그룹 시작페이지 번호 -1 =>
			   이전 페이지 그룹의 마지막 페이지 번호로 한다. 
		 --%>
		<c:if test="${requestScope.mybuybooklvo.pagingBean.previousPageGroup}">
			<a href="auth_book_mybuybook_list.do?pageNo=${requestScope.mybuybooklvo.pagingBean.startPageOfPageGroup-1}">
			<img src="${initParam.root }/img/left_arrow_btn.gif"></a>
		</c:if>
		</td>
		<td style="padding-bottom: 3px;">
		<%-- PagingBean 을 이용해서 현재 페이지에 해당되는 페이지그룹의
			   시작페이지~~마지막페이지까지 화면에 보여준다. 
			   이 때 현재 페이지를 제외한 나머지 페이지는 링크를 걸어
			   해당 페이지에 대한 게시물 리스트 조회가 가능하도록 한다. 
		 --%>
		<c:forEach var="i"
			begin="${requestScope.mybuybooklvo.pagingBean.startPageOfPageGroup}"
			end="${requestScope.mybuybooklvo.pagingBean.endPageOfPageGroup}">
			<c:choose>
				<c:when test="${requestScope.mybuybooklvo.pagingBean.nowPage!=i}">
					<a href="auth_book_mybuybook_list.do?pageNo=${i}">&nbsp;&nbsp;${i}&nbsp;&nbsp;</a>
				</c:when>
				<c:otherwise>&nbsp;&nbsp;${i}&nbsp;&nbsp;</c:otherwise>
			</c:choose>
		</c:forEach>
		</td>
		<td>
		<%-- 다음 페이지 그룹이 있으면 화살표 이미지를 보여준다.
				이미지 링크는 현재 페이지 그룹의 마지막 번호 + 1 => 
				다음 그룹의 시작 페이지로 링크한다. 
				right_arrow_btn.gif
		 --%>
		<c:if test="${requestScope.mybuybooklvo.pagingBean.nextPageGroup}">
			<a href="auth_book_mybuybook_list.do?pageNo=${requestScope.mybuybooklvo.pagingBean.endPageOfPageGroup+1}">
				<img src="${initParam.root }/img/right_arrow_btn.gif">
			</a>
		</c:if>
		</td>
	</tr>
</table>
		<br><br>
			</c:otherwise>
</c:choose>
		</fieldset>
		</center>
